<template>
  <div>
    <van-grid :border="false" :column-num="5">
      <van-grid-item @click="jianfangshigong">
        <img src="../../image/1.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">建房施工</span>
      </van-grid-item>

      <van-grid-item @click="jianfangshigong1">
        <img src="../../image/2.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">装修施工</span>
      </van-grid-item>

      <van-grid-item @click="jianfangshigong2">
        <img src="../../image/3.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">建房主材</span>
      </van-grid-item>


      <van-grid-item @click="jianfangshigong3">
        <img src="../../image/4.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">家居建材</span>
      </van-grid-item>

      <van-grid-item @click="jianfangshigong4">
        <img src="../../image/5.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">免费质检</span>
      </van-grid-item>


      <van-grid-item @click="jianfangshigong5">
        <img src="../../image/6.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">免费图库</span>
      </van-grid-item>

      <van-grid-item @click="jianfangshigong6">
        <img src="../../image/7.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">施工攻略</span>
      </van-grid-item>

      <van-grid-item @click="jianfangshigong7">
        <img src="../../image/8.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">租赁服务</span>
      </van-grid-item>

      <van-grid-item @click="jianfangshigong8">
        <img src="../../image/9.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">同城安装</span>
      </van-grid-item>

      <van-grid-item @click="jianfangshigong9">
        <img src="../../image/10.png" alt="">
        <span style="font-size: 0.7rem;padding-top: 0.5rem">金融支持</span>
      </van-grid-item>
    </van-grid>

  <!-- 首页导航 -->
<!--  <div class="index_nav">-->
<!--    <van-grid :column-num="5" :border="false">-->
<!--      <van-grid-item-->
<!--        v-for="(item, index) in nav_list"-->
<!--        :key="index"-->
<!--        :icon="item.icon"-->
<!--        :text="item.title"-->
<!--        :to="item.path"-->
<!--      />-->
<!--    </van-grid>-->
<!--  </div>-->
  </div>
</template>

<script>
export default {
  name: "IndexNav",
  props: {
    //nav_list: Array, //导航数据
    inputName: String,
  },
  data() {
    return {
      nav_list: [
        //导航数据
        {
          title: "建房施工",
          icon: require('../../image/1.png'),
          path: "Construction",
        },
        {
          title: "装修施工",
          icon: require('../../image/2.png'),
          path: "DecorationProcess",
        },
        {
          title: "建房主材",
          icon: require('../../image/3.png'),
          path: "mainMaterial_index",
        },
        {
          title: "家居建材",
          icon: require('../../image/4.png'),
          path: "buildingMaterial_index",
        },
        {
          title: "免费质检",
          icon: require('../../image/5.png'),
          path: "inspection_index",
        },
        {
          title: "免费图库",
          icon: require('../../image/6.png'),
          path: "gallery_index",
        },
        {
          title: "施工攻略",
          icon: require('../../image/7.png'),
          path: "strategy_index",
        },
        {
          title: "租赁服务",
          icon: require('../../image/8.png'),
          path: "LeaseIndex",
        },
        {
          title: "同城安装",
          icon: require('../../image/9.png'),
          path: "citywide_index",
        },
        {
          title: "金融支持",
          icon: require('../../image/10.png'),
          path: "support_index",
        },
      ],

    };
  },

  methods:{
    jianfangshigong(){
      this.$router.push({ path: "/Construction", query:{carouselArea: this.inputName} })
    },
    jianfangshigong1(){
      this.$router.push({ path: "/DecorationProcess", query:{carouselArea: this.inputName} })
    },
    jianfangshigong2(){
      this.$router.push({ path: "/mainMaterial_index", query:{carouselArea: this.inputName} })
    },
    jianfangshigong3(){
      this.$router.push({ path: "/buildingMaterial_index", query:{carouselArea: this.inputName} })
    },
    jianfangshigong4(){
      this.$router.push({ path: "/inspection_index", query:{carouselArea: this.inputName} })
    },
    jianfangshigong5(){
      this.$router.push({ path: "/gallery_index", query:{carouselArea: this.inputName} })
    },
    jianfangshigong6(){
      this.$router.push({ path: "/strategy_index", query:{carouselArea: this.inputName} })
    },
    jianfangshigong7(){
      this.$router.push({ path: "/LeaseIndex", query:{carouselArea: this.inputName} })
    },
    jianfangshigong8(){
      this.$router.push({ path: "/citywide_index", query:{carouselArea: this.inputName} })
    },
    jianfangshigong9(){
      this.$router.push({ path: "/support_index", query:{carouselArea: this.inputName} })
    },






  }

};
</script>

<style scoped>
.index_nav {
  background-color: #ffffff;
}
</style>
